--
-- Created by IntelliJ IDEA.
-- User: huanghaojing
-- Date: 16/11/15
-- Time: 下午2:57
-- To change this template use File | Settings | File Templates.
--

local html = [[
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>数据提交简单示例</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <!--标准mui.css-->
    <!--App自定义的css-->
</head>

<body>
    <form id="form1" name="showUI_commit" method="post" action="/set_event">
        <br>
        <h5>输入框-普通</h5>
        <label>输入框：
            <input type="text" name="com3" value="测试" placeholder="请输入">
        </label>
        <br>
        <h5>输入框-数字</h5>
        <label>输入框：
            <input type="number" name="com4" value="1" placeholder="请输入">
        </label>
        <br>
        <h5>输入框-多行</h5>
        <label>输入框：
            <textarea name="com7" placeholder="请输入" row="5">asd</textarea>
        </label>

        <br>
        <br>
        <button id="actions" type="button">提交</button>
        <button id="cancel" type="button">取消</button>
    </form>
    <script type="text/javascript">
    var com3Val = document.getElementsByName('com3')[0].value; //获取name为com3的值
    var com4Val = document.getElementsByName('com4')[0].value; //获取name为com7的值
    var com7Val = document.getElementsByName('com7')[0].value; //获取name为com3的值
    var data = com3Val + "," + com4Val + "," + com7Val;

    function actions(data) {//数据提交post请求
        var xhr = new XMLHttpRequest();
        xhr.open("POST", "/set_event", true);
        xhr.setRequestHeader("Content-type", "application/json");
        xhr.onreadystatechange = function() {
            var XMLHttpReq = xhr;
            if (XMLHttpReq.readyState == 4) {
                if (XMLHttpReq.status == 200) {
                    var text = XMLHttpReq.responseText;
                    console.log(text);
                } else {
                    console.log(XMLHttpReq.status)
                }
            } else {
                console.log(XMLHttpReq.readyState);
            }
        };
        alert('{"name": "showUI_commit","value":' + data + '}')
        xhr.send('{"name": "showUI_commit","value":"' + data + '"}');
    }

    function closed() {//取消post请求
        var xhr = new XMLHttpRequest();
        xhr.open("POST", "/set_event", true);
        xhr.setRequestHeader("Content-type", "application/json");
        xhr.onreadystatechange = function() {
            var XMLHttpReq = xhr;
            if (XMLHttpReq.readyState == 4) {
                if (XMLHttpReq.status == 200) {
                    var text = XMLHttpReq.responseText;
                    console.log(text);
                } else {
                    console.log(XMLHttpReq.status)
                }
            } else {
                console.log(XMLHttpReq.readyState);
            }
        };
        xhr.send('{"name": "showUI_cancel"}');
    }
    document.getElementById('actions').onclick = function() {//数据提交按钮点击
        actions(data);
    }
    document.getElementById('cancel').onclick = function() {//取消按钮点击
        closed();
    }
    </script>
</body>

</html>
]]


local thread = require('thread')
local event = require('event')
local sz = require('sz')
local json = sz.json
--创建webview
local showui_view,err = require('webview').new("myshowui",
    {html=html})


assert(showui_view,err)


event.register("showUI_commit",function(value)
    toast(json.encode(value))
    showui_view.close()
end)

event.register("showUI_cancel",function(value)
    showui_view.close()
end)

showui_view.show()


thread.waitAllThreadExit()
